<template>
	<div class="index">
		<el-table
	      :data="CompanyContent"
	      style="width: 100%"
	      max-height="760"
	      border
	      >   
	      <el-table-column
		        label="全选"
		        width="50"
		        fixed
		   >
		        <template slot-scope="scope">
			        <el-checkbox
			          type="text"
			        >
			        </el-checkbox>
			    </template>
		  </el-table-column>
	      <el-table-column
		        type="index"
		        label="序号"
		        width="50"
		        fixed
		    >
		  </el-table-column>
		      <el-table-column
		        prop="date"
		        label="日期"
		        width="100"
		        fixed
		        :filters="[{text: '2018-12-1', value: '2018-12-31'}]"
	     		:filter-method="filterHandler"
		        sortable
		        >
		      </el-table-column>
		      <el-table-column
		        prop="company"
		        label="客户名称"
		        :formatter="formatter"
		        >
		      </el-table-column>
		      <el-table-column
		        prop="name"
		        label="联系人"
		        >
		      </el-table-column>
		      <el-table-column
		        prop="iphone"
		        label="电话"
		        >
		      </el-table-column>
		      <el-table-column
			      prop="tag"
			      label="组织机构"
			      :filters="[{ text: '东莞松山湖', value: '东莞松山湖' },{ text: '南昌分公司', value: '南昌分公司'}]"
			      :filter-method="filterTag"
			       filter-placement="bottom-end"
			   >
			      <template slot-scope="scope">
			        <el-tag
			          :type="scope.row.tag === '东莞松山湖' ? 'primary' : 'success'"
			          disable-transitions>
			          {{scope.row.tag}}
			        </el-tag>
			      </template>
			   </el-table-column>
			   <el-table-column
			      fixed="right"
			      label="操作"
			      width="100"
			   >
			      <template slot-scope="scope">
			        <el-button
			          @click.native.prevent="deleteRow(scope.$index, CompanyContent)"
			          type="text"
			          size="small">
			                      移除
			        </el-button>
			        <el-button
			          @click.native.prevent="redactRow(scope.$index, CompanyContent)"
			          type="text"
			          size="small">
			                    编辑
			        </el-button>
			      </template>
			    </el-table-column>
		</el-table>
	</div>
</template>

<script>
	export default {
		name:"companycontent",
		props:{
			CompanyContent:Array
		},
		data(){
			return {
				tableData:[]
			}
		},
		methods:{
		      formatter(row, column) {
		        return row.company;
		      },
		      filterTag(value, row) {
		        return row.tag === value;
		      },
		      filterHandler(value, row, column) {
		        const property = column['property'];
		        return row[property] === value;
		      },
			  deleteRow(index,rows) {
                  const _this = this
			  	  this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
			          confirmButtonText: '确定',
			          cancelButtonText: '取消',
			          type: 'warning'
			        }).then(() => {
			           this.CompanyDelete(index,rows)
			          	this.$message({
			            type: 'success',
			            message: '删除成功!'
			            });
			            rows.splice(index, 1);
			        }).catch(() => {
			          this.$message({
			            type: 'info',
			            message: '已取消删除'
			          })        
			        })
		      },
		      redactRow(index,rows){
		      	console.log(index)
		      	console.log(rows)
		      },
		      CompanyDelete(index,rows){
		      	const _this = this
		      	this.axios.get('http://192.168.0.101:5050/ColtdDelete/',{
		      		params:{
		      			Cid:rows[index].Cid
		      		}
		      	}
		        ).then(res=>{
		      	    res = res.data
		      	})
		      }
		},
		mounted(){

		}
	}
</script>

<style scoped>
	.index >>> .el-table td,.index  >>> .el-table th {
		text-align: center;
	}
</style>